<%@ page language="java" contentType="text/html; charset=utf-8"	pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<link   type="text/css" rel="stylesheet" href="<c:url value='/css/web/gis.css'/>">
<link   type="text/css" rel="stylesheet" href="<c:url value='/css/web/pagination.css'/>">
<div class="easyui-layout station-page" data-options="fit:true,border:false">
	<div id="searchDiv" class="search-panel" >
		<div class="search-input">
			<input id="stationType" type="text" name="siteType" class="easyui-combobox" style="width:120px;height:32px" data-options="prompt:'站点类型'"/>
			<input id="keyword" type="text" name="keyword" class="easyui-textbox" style="width:200px;height:32px;" data-options="prompt:'站点名称关键字'">
			<a href="javascript:void(0);" class="easyui-linkbutton"
			   data-options="iconCls:'icon-search',plain:true" onclick="stationSearch();"></a>
		</div>
		<div class="search_result">
			<div class="easyui-panel" title="搜索结果" style="width:400px;" data-options="collapsible:true,closable:true">
				<ul id="result_ul">
				</ul>
			</div>
		</div>

		<div id="dlg" class="easyui-dialog" title="车头照片" closed="true" data-options="iconCls:'icon-save'" style="display:block;width:80%;height:80%;padding:10px">
			<img  id="largeImg" class="headpic" style="" src="">
		</div>
		<div class="search_detail">
			<div class="easyui-panel" title="站点详情" style="width:400px;" data-options="collapsible:true,closable:true">
				<div class="easyui-tabs" data-options="tabWidth:94" style="width:398px;">
					<div title="基本信息" style="padding:10px">
						<table class="table-bordered base-table" style="width: 100%">
							<tr><td class="base-title">站点编码：</td><td id="baseCode"></td></tr>
							<tr><td class="base-title">站点名称：</td><td id="baseName"></td></tr>
							<tr><td class="base-title">站点类型：</td><td id="baseType"></td></tr>
							<tr><td class="base-title">行政区划：</td><td id="baseDivision"></td></tr>
							<tr><td class="base-title">管理机构：</td><td id="baseOrgan"></td></tr>
							<tr><td class="base-title">详细地址：</td><td id="baseAddress"></td></tr>
						</table>
					</div>
					<div title="设备信息" style="padding:10px">
						<table class="table-bordered equip-table" style="width: 100%">
							<thead>
								<tr><th>设备编号</th><th>设备名称</th><th>设备类型</th><th>是否正常</th></tr>
							</thead>
							<tbody id="equip-tbody">
							<tr><td></td></tr>
							</tbody>
						</table>
					</div>
					<div title="实时数据" style="padding:10px">
						<div style="width: 95%;position: absolute;">
							<span class="l-btn-left l-btn-icon-left" style="float: right;cursor: pointer;" onclick="refreshNowData();">
								<span class="l-btn-text" style="width: 5px;height: 24px;"></span>
								<span class="l-btn-icon icon-reload">&nbsp;</span>
							</span>
						</div>
						<table class="text-left-table now-table" style="width: 100%">
							<tbody >
							<tr><td colspan="2"><span class="now-title">统计时间：</span><span id="countTime"></span></td></tr>
							<tr><td colspan="2"><span class="now-title">当日总车流量：</span><span id="trainCount"></span></td></tr>
							<tr>
								<td><span class="now-title">最近一次采集的车辆数据：</span></td>
								<td class="now-img-td" onclick="$('#dlg').dialog('open')"><img class="headpic"  id="smallImg" height="60" src=""></td>
							</tr>
							</tbody>
						</table>
						<table class="table-bordered equip-table" style="width: 100%">
							<thead>
							<tr><th>采集时间</th><th>车牌号码</th><th>车轴数</th><th>车货总重</th><th>超限量</th></tr>
							</thead>
							<tbody id="now-tbody">
							</tbody>
						</table>
					</div>
					<div title="历史数据" style="padding:10px;">
						<div id="Searchresult">
							<div class="result history-table">
								<table class="table-bordered equip-table" style="width: 100%">
								<thead>
								<tr><th>采集时间</th><th>车牌号码</th><th>车轴数</th><th>车货总重</th><th>超限量</th></tr>
								</thead>
								<tbody id="history-tbody">
								<tr><td colspan="5">暂无数据</td></tr>
								</tbody>
								</table>
							</div>
						</div>
						<div id="Pagination" class="pagination"></div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<div id="btnDiv" class="btn-group">
		<div class="easyui-panel" style="margin:5px;">
			<a onclick="danping();" class="easyui-linkbutton" data-options="" style="width:80px;display: none;">单屏</a>
			<a onclick="shuangping();" class="easyui-linkbutton" data-options="" style="width:80px;display: none;">多屏</a>
			<a href="#" class="easyui-menubutton" data-options="menu:'#mm1'" style="width:120px">功能菜单</a>
		</div>
		<div id="mm1" style="width:100px;">
			<div onclick="showCount();">站点数量统计</div>
			<div onclick="showHeatMap();">热力专题图</div>
		</div>
	</div>
	<div id="countDiv" class="count-panel" style="" >
		<div class="easyui-panel" title="站点数量统计情况" style="width:360px;height:180px;padding:5px;" data-options="closable:true">
			<table class="table-bordered" style="width:350px;">
				<thead>
				<tr>
					<th id="count-level">省份</th>
					<th>合计</th>
					<th>治超站</th>
					<th>收费站</th>
					<th>移动执法</th>
					<th>源头企业</th>
					<th>流动执法</th>
				</tr>
				</thead>
				<tbody id="station-count-table">

				</tbody>
			</table>
		</div>
	</div>
	<div id="heatMapDiv" class="heat-map-panel" style="" >
		<div class="easyui-panel" title="热力专题图" style="width:360px;padding:5px;" data-options="closable:true">
			<div class="easyui-tabs" data-options="tabWidth:167" style="width:348px;">
				<div title="单图模式" style="padding:10px">
					<table class="text-left-table heat-table">
						<tr>
							<td>
								<input id="weightType" type="radio" name="certType" class="easyui-validatebox" value="1">
								<label>载荷分布热力图</label>
								</input>
							</td>
						</tr>
						<tr>
							<td>
								<input id="overrunType" type="radio" name="certType" class="easyui-validatebox" value="2">
								<label>超限车辆热力图</label>
								</input>
							</td>
						</tr>
						<tr>
							<td>
								<input id="trainType" type="radio" name="certType" class="easyui-validatebox" value="3">
								<label>车流量热力图</label>
								</input>
							</td>
						</tr>
					</table>
				</div>
				<div title="多图模式" style="padding:10px" onclick="duotu();">
				</div>
			</div>
		</div>
	</div>


	<div data-options="region:'center',border:false,fit:true" title="站点信息">
		<div id="resource" class="" data-options="split:true,fit:true,border:false"  style="height: 100%;">
			<div id="allmap"  style="height: 100%;width: 100%;"></div>
		</div>
	</div>
</div>
<script type="text/javascript" src="<c:url value='/scripts/web/gis/station_query.js'/>"></script>
<script type="text/javascript" src="<c:url value='/scripts/web/gis/jquery.pagination.js'/>"></script>